<template>
<view>
<block v-for="(item, itemIndex) in diyItems" :key="itemIndex">

  <!-- banner轮播 -->
  <block v-if="item.type === 'banner'">
		<view class="wrap30 bgf">
			<diy-banner :itemIndex="itemIndex" :itemStyle="item.style" :params="item.params" :dataList="item.data"></diy-banner>
		</view>
  </block>

  <!-- 单图组 -->
  <block v-if="item.type === 'imageSingle'">
		<view class="wrap30">
			<diy-imageSingle :itemIndex="itemIndex" :itemStyle="item.style" :dataList="item.data"></diy-imageSingle>
		</view>
  </block>

  <!-- 视频组 -->
  <block v-if="item.type === 'video'">
		<view class="wrap30 bgf">
    <diy-video :itemIndex="itemIndex" :itemStyle="item.style" :params="item.params"></diy-video>
		</view>
  </block>

  <!-- 文章组 -->
  <block v-if="item.type === 'article'">
    <diy-article :itemIndex="itemIndex" :params="item.params" :dataList="item.data"></diy-article>
  </block>

  <!-- 头条快报 -->
  <block v-if="item.type === 'special'">
    <diy-special :itemIndex="itemIndex" :itemStyle="item.style" :params="item.params" :dataList="item.data"></diy-special>
  </block>

		<!-- 店铺公告 -->
		<block v-if="item.type === 'notice'">
			<view class="wrap30 m-t-20">
				<diy-notice :params="item.data"></diy-notice>
			</view>
		</block>
  <!-- 公告组 -->
  <!-- <block v-if="item.type === 'notice'">
    <diy-notice :itemIndex="itemIndex" :itemStyle="item.style" :params="item.params"></diy-notice>
  </block> -->

  <!-- 空白组 -->
  <block v-if="item.type === 'blank'">
    <diy-blank :itemIndex="itemIndex" :itemStyle="item.style"></diy-blank>
  </block>

  <!-- 辅助线 -->
  <block v-if="item.type === 'guide'">
    <diy-guide :itemIndex="itemIndex" :itemStyle="item.style"></diy-guide>
  </block>

  <!-- 在线客服 -->
  <block v-if="item.type === 'service'">
    <diy-service :itemIndex="itemIndex" :itemStyle="item.style" :params="item.params"></diy-service>
  </block>

  <!-- 富文本 -->
  <block v-if="item.type === 'richText'">
    <diy-richText :itemIndex="itemIndex" :itemStyle="item.style" :params="item.params"></diy-richText>
  </block>

  <!-- 导航组 -->
  <block v-if="item.type === 'navBar'">
		<view class="wrap30 navBar">
			<diy-navBar :user="user" :itemIndex="itemIndex" :itemStyle="item.style" :dataList="item.data"></diy-navBar>
		</view>
  </block>

  <!-- 图片橱窗 -->
  <block v-if="item.type === 'window'">
    <diy-window :itemIndex="itemIndex" :itemStyle="item.style" :dataList="item.data"></diy-window>
  </block>

  <!-- 商品组 -->
  <block v-if="item.type === 'goods'">
		<view class="wrap30" v-if="item.params.source === 'recommend' || item.params.source === 'hot'">
			<diy-sharpGoods :itemIndex="itemIndex" :itemStyle="item.style" :dataList="item.data" :params="item.params"></diy-sharpGoods>
		</view>
		<view class="wrap30" v-else>
			
			<tui-nomore v-if="item.data!=''" backgroundColor="#f8f8f8" text="商品展示"></tui-nomore>
			<product-water :list="item.data"></product-water>
		</view>
  </block>

  <!-- 优惠券组 -->
  <block v-if="item.type === 'coupon'">
    <diy-coupon :itemIndex="itemIndex" :itemStyle="item.style" :dataList="item.data"></diy-coupon>
  </block>

  <!-- 拼团商品 -->
  <block v-if="item.type === 'sharingGoods'">
    <diy-sharingGoods :itemIndex="itemIndex" :itemStyle="item.style" :dataList="item.data"></diy-sharingGoods>
  </block>

  <!-- 砍价商品 -->
  <block v-if="item.type === 'bargainGoods'">
    <diy-bargainGoods :itemIndex="itemIndex" :itemStyle="item.style" :dataList="item.data"></diy-bargainGoods>
  </block>

  <!-- 秒杀商品 -->
  <block v-if="item.type === 'sharpGoods'">
		<view class="wrap30">
			<diy-sharpGoods ref="diySharpGoods" :itemIndex="itemIndex" :itemStyle="item.style" :itemData="item.data" :params="item.params"></diy-sharpGoods>
		</view>
  </block>

  <!-- 线下门店 -->
  <block v-if="item.type === 'shop'">
    <diy-shop :itemIndex="itemIndex" :itemStyle="item.style" :dataList="item.data"></diy-shop>
  </block>

  <!-- 关注公众号 -->
  <block v-if="item.type === 'officialAccount'">
    <diy-officialAccount :itemIndex="itemIndex" :itemStyle="item.style" :dataList="item.data"></diy-officialAccount>
  </block>

</block>
</view>
</template>

<script>
import diyBanner from "./banner/banner";
import diyImageSingle from "./imageSingle/imageSingle";
import diyVideo from "./video/video";
import diyArticle from "./article/article";
import diySpecial from "./special/index";
import diyBlank from "./blank/blank";
import diyGuide from "./guide/guide";
import diyNavBar from "./navBar/navBar";
import diyWindow from "./window/window";
import diyCoupon from "./coupon/coupon";
import diyNotice from "./notice/notice";
import diyService from "./service/service";
import diyRichText from "./richText/richText";
import diySharingGoods from "./sharingGoods/sharingGoods";
import diyBargainGoods from "./bargainGoods/index";
import diySharpGoods from "./sharpGoods/index";
import diyShop from "./shop/index";
import diyOfficialAccount from "./officialAccount/index";
import productWater from "@/components/waterfall/product-water";

export default {
  data() {
    return {};
  },
  props: {
    diyItems: Object,
    user: {
      type: Object
    }
  },
  components: {
    diyBanner,
    diyImageSingle,
    diyVideo,
    diyArticle,
    diySpecial,
    diyBlank,
    diyGuide,
    diyNavBar,
    diyWindow,
    diyCoupon,
    diyNotice,
    diyService,
    diyRichText,
    diySharingGoods,
    diyBargainGoods,
    diySharpGoods,
    diyShop,
    diyOfficialAccount,
		productWater,
  },
  options: {},
  methods: {}
};
</script>
<style lang="scss">
.navBar{
	background: linear-gradient(to bottom, #fff, #f8f8f8);
}	
</style>